<template>
  <section>
  	<div class="model retrieval">
  		<img :src="IMGBASE64.JIANSUOGUANLI2X" class="orange">
      <span class="title">检索管理</span>
      <div class="body">
        <span>请假类型:</span>
        <select class="select" v-model="typeSelect" :style="{background: `url(${IMGBASE64.SELECT}) no-repeat scroll right center`}">
          <option v-for="(item, key) in typeOption" :label="item" :value="key"></option>
        </select>
        <template class="dataChoose">
          <el-date-picker
            format="yyyy-MM-dd"
            ref="date"
            v-model="value1"
            type="date"
            placeholder="选择日期"
            :picker-options="pickerOptions0"
            size="small">
          </el-date-picker>
        </template>
        <el-button type="primary" v-on:click="dataSearch" size="small">确认</el-button>
      </div>
  	</div>

  	<div class="model leave">
  		<img :src="IMGBASE64.QINGJIAFUDAO2X" class="pink">
      <span class="title">请假辅导</span>
      <div class="kong"></div>
      <template>
      	<el-table :data="tablemsg" style="width: 100%">
      		<el-table-column prop="coachId" label="#" width="80" align="center"></el-table-column>
      		<el-table-column prop="studentName" label="姓名" align="center"></el-table-column>
      		<el-table-column prop="leaveTypestr" label="请假类型" align="center"></el-table-column>
      		<el-table-column prop="leaveStartTimestr" label="开始时间" align="center"></el-table-column>
      		<el-table-column prop="leaveEndTimestr" label="结束时间" align="center"></el-table-column>
      		<el-table-column prop="leaveReason" label="请假理由" :show-overflow-tooltip='true' align="center"></el-table-column>
      		<el-table-column prop="cPhone" label="联系方式" align="center"></el-table-column>
      		<el-table-column prop="coachStatusText" label="状态" width="100" align="center">
      		</el-table-column>
      		<el-table-column label="操作" width="150" align="center">
      			<template scope="scope">
      				<el-button type="text" size="small"><router-link to="/course/coach/addCoach">我要辅导</router-link></el-button>
      				<el-button type="text" size="small" @click="notCounse(scope)">无需辅导</el-button>
      			</template>
      		</el-table-column>
      	</el-table>
        <el-pagination
          v-show="paging"
          @current-change="handleCurrentChange"
          :page-size="20"
          layout="prev, pager, next, jumper"
          :total="total"
          class="pull-right">
        </el-pagination>
      </template>
  	</div>
  </section>
</template>

<script>
export default {
  data () {
    return {
      leaveType: null,
      typeSelect: null,
      typeOption: [],
      value1: null,
      total: 0,
      page: 1,
      paging: true,
      tablemsg: [{
        num: '1',
        name: '欧阳俊逸',
        type: '病假',
        sTime: '2015/09/01 12:00:00',
        eTime: '2015/09/01 12:00:00',
        reason: '请所有老师首次登录系统后',
        phone: '13688888888',
        status: true,
        yes: false,
        no: false
      },
      {
        num: '2',
        name: '欧阳俊逸',
        type: '病假',
        sTime: '2015/09/01 12:00:00',
        eTime: '2015/09/01 12:00:00',
        reason: '请所有老师首次登录系统后',
        phone: '13688888888',
        status: false,
        yes: false,
        no: false
      },
      {
        num: '3',
        name: '欧阳俊逸',
        type: '病假',
        sTime: '2015/09/01 12:00:00',
        eTime: '2015/09/01 12:00:00',
        reason: '请所有老师首次登录系统后',
        phone: '13688888888',
        status: true,
        yes: false,
        no: false
      }]
    }
  },
  methods: {
    dataSearch (time) {
      if (this.typeSelect === 0) {
        this.leaveType = '1'
      } else if (this.typeSelect === 1) {
        this.leaveType = '2'
      } else {
        this.leaveType = null
      }
      // let _cookie = document.cookie.split(';')
      // let _cookieArray = []
      // _cookie.forEach(v => {
      //   let _d = v.split('=')
      //   _cookieArray.push({
      //     key: _d[0],
      //     value: _d[1]
      //   })
      // })
      this.$http.post(this._httpUrl + 'course/coach/leaveCoach', {
        queryDate: this.$refs.date.displayValue,
        leaveType: this.leaveType,
        page: String(this.page),
        rows: '20'
      }, {'headers': {'yxt-xtoken': localStorage.xtoken}}).then(function (response) {
        if (response.body.code === '000') {
          // console.log(response.data.data)
          this.tablemsg = response.data.data.content
        } else if (response.body.code === '887') {
          this.$router.push('/')
        } else if (response.body.code === '889') {
          this.$router.push('/')
        }
      })
    },
    pickerOptions0 (time) {
      return time.getTime() < Date.now() - 8.64e7
    },
    handleCurrentChange (val) {
      this.page = val
      this.getStudentNameData()
    },
    notCounse (scope) {
      scope.row.coachStatusText = '无需辅导'
    }
    // needCounse (scope) {
    //   let _cookie = document.cookie.split(';')
    //   let _cookieArray = []
    //   _cookie.forEach(v => {
    //     let _d = v.split('=')
    //     _cookieArray.push({
    //       key: _d[0],
    //       value: _d[1]
    //     })
    //   })
    //   console.log(scope.row)
    //   this.$http.post('http://119.23.36.128:8020/yxt-web/studentCoach/coaching', {coachId: scope.row.coachId, coachResult: scope.row.coachResult, coachTime: scope.row.coachTime}, {'headers': {'yxt-xtoken': _cookieArray[0].value}}).then(function (response) {
    //     if (response.body.code === '000') {
    //     } else {
    //       this.$route.push('/login')
    //     }
    //   })
    // }
  },
  mounted () {
    // let _cookie = document.cookie.split(';')
    // let _cookieArray = []
    // _cookie.forEach(v => {
    //   let _d = v.split('=')
    //   _cookieArray.push({
    //     key: _d[0],
    //     value: _d[1]
    //   })
    // })
    this.$http.post(this._httpUrl + 'course/coach/leaveCoach', {}, {'headers': {'yxt-xtoken': localStorage.xtoken}}).then(function (response) {
      if (response.body.code === '000') {
        // console.log(response.data.data)
        this.tablemsg = response.data.data.content
        for (var i = 0; i < this.tablemsg.length; i++) {
          if (this.tablemsg[i].fatherMobile == null) {
            this.tablemsg[i].cPhone = this.tablemsg[i].motherMobile
          } else if (this.tablemsg[i].motherMobile == null) {
            this.tablemsg[i].cPhone = this.tablemsg[i].fatherMobile
          } else {
            this.tablemsg[i].cPhone = this.tablemsg[i].fatherMobile
          }
          if (this.tablemsg[i].leaveStatusstr === '待审批') {
            this.tablemsg[i].yes = true
          } else {
            this.tablemsg[i].no = true
          }
        }
      } else if (response.body.code === '887') {
        this.$router.push('/')
      } else if (response.body.code === '889') {
        this.$router.push('/')
      }
    })
    this.$http.post(this._httpUrl + 'course/coach/type', {}, {'headers': {'yxt-xtoken': localStorage.xtoken}}).then(function (response) {
      if (response.body.code === '000') {
        // console.log(response.data.data)
        this.typeOption = []
        this.typeOption.push(response.data.data[1])
        this.typeOption.push(response.data.data[2])
      } else if (response.body.code === '887') {
        this.$router.push('/')
      } else if (response.body.code === '889') {
        this.$router.push('/')
      }
    })
  }
}
</script>

<style lang="less" scoped>
	.model{
		width: 98%;
		position: relative;
		background: #FFF;
		margin-left: 1%;
		margin-top: 60px;
		border-radius: 5px;
		padding-top: 10px;
	}

	.kong{
		padding: 20px;
	}
  .retrieval{
    .orange{
      position: absolute;
      left: 2%;
      top: -20px;
    }
    .title{
      margin-left: 11%;
    }
    .body{
      padding: 40px 0 10px 11%;
      span{
      	margin-left: 4%;
      }
      span:first-child{
      	margin-left: 0;
      }
      .select{
        width: 13%;
        border: 0;
        border-bottom: 1px solid #D7D7D7;
        margin-right: 4%;
      }
    }
  }

  .leave{
  	.pink{
      position: absolute;
      left: 2%;
      top: -20px;
    }
    .title{
      margin-left: 11%;
    }
  }

  a{
    text-decoration: none;
    color: #20A0FF;
  }
</style>
